<template>
    <div>
        <div class="detail">
            <Row>
                <Col span="24">
                    <Button type="warning"  @click="permissionCreate" size="large" class="fr mt10">新增策略组</Button>
                </Col>
            </Row>
            <div class="clearfix">
                <div class="table-theme">
                    <Table :loading="tableloading"  ref="currentRowTable" @on-current-change="tableCurrentChange($event)" size="large" stripe highlight-row border :columns="columns1" :data="permission_list" class=""></Table>
                </div>                        
            </div>
        </div>
        <div :class="slidetoggle?'fixed-bottom':'fixed-bottom sidehide' ">
            <Row class="pro-pagesize">
                <Col :sm="24" :md="24" :lg="8">
                    <Button type="error" :disabled="tableaction" @click="Del" size="large" class="fl mr10 ">删除</Button>
                    <Button type="info" :disabled="tableaction" @click="permissionEdit" size="large" class="fl mr10">编辑</Button>                         
                </Col>
                <Col :sm="24" :md="24" :lg="16" class="tRight">
                    <Page ref="pages" :current="currentpage" :total="listTotal" show-total show-sizer :page-size="pagesize" @on-change="pageChange" @on-page-size-change="pageSizeChange" placement="top" class="page"></Page>
                </Col>
            </Row>
        </div>
    </div>
</template>
<script>
import { getOperation , PermissionGetList , PermissionDel} from '../../api/yun_permission'
export default {
    data () {
      return {
            showactionModal:true,
            closeable:false,
            loading:false,
            tableloading:true,
            tableaction:true,
            action:{

            },
            operations:{

            },
            currentpage:1,
            listTotal:0,
            p:1,
            pagesize:10,
            currentRow:{},
            origin_actions:{},
            actionlist:[],
            columns1:[
                {
                    type: 'index',
                    title:'序号',
                    width: 60,
                    align: 'center'
                },
                {
                    title: '策略组名',
                    key: 'name',
                    align: 'center',
                },
                {
                    title: '创建时间',
                    key: 'create_timed',
                    align: 'center',
                },
            ],
            permission_list:[]
      }
    },
    computed: {
        slidetoggle(){
            return this.$store.state.sildeshow
        }
    },
    mounted () {
      this.getList()  
    },
    methods: {
        pageChange(val){
            this.p=val;
            this.getList();
        },
        pageSizeChange(val){
            this.p=1;
            this.pagesize=val;
            this.getList();
        },
        permissionCreate(){
            this.$router.push({name:'permission_create'})
        },
        getList(){
            this.tableaction = true;
            let params={
                p:this.p,
                pagesize:this.pagesize
            }
            new Promise((resolve,reject)=>{
                    PermissionGetList(params).then(response=>{
                        console.log(response)
                        if(response.data.err == 0){
                            this.permission_list = response.data.data.list
                            this.listTotal = response.data.data.total
                            this.tableloading = false
                        }
                        resolve();
                    }).catch(error => {
                    reject(error);
                })
            })
        },
        getPermission(){
            new Promise((resolve,reject)=>{
                    getOperation().then(response=>{
                        console.log(response)
                        if(response.data.err == 0){
                            this.operations = response.data.data.operations
                            this.origin_actions = response.data.data.origin_actions
                        }
                        resolve();
                    }).catch(error => {
                    reject(error);
                })
            })
        },
        tableCurrentChange(currentRow,oldCurrentRow){
            console.log(currentRow)
            console.log(oldCurrentRow)
            this.tableaction = false;
            this.currentRow = currentRow
        },
        permissionEdit(){
            this.$router.push({name:'permission_update',params:{id:this.currentRow._id}})
        },
        Del() {
            this.$Modal.confirm({
                title: '提示',
                content: '是否要删除该条数据?',
                onOk: () => {
                    this.permissionDel()
                },
            });
        },
        permissionDel(){
            let _params = {
                permission_id : this.currentRow._id
            }
            new Promise((resolve,reject)=>{
                    PermissionDel(_params).then(response=>{
                        console.log(response)
                        if(response.data.err == 0){
                            this.tableloading = true
                            this.getList()
                        }
                        resolve();
                    }).catch(error => {
                    reject(error);
                })
            })
        }
  }
}
</script>
<style scoped>
.fixed-bottom{
    padding-left: 20px;
    padding-right: 20px;
    height: 80px;
    line-height: normal !important;
    position: fixed;
    left: 210px;
    right: 0;
    bottom: 0;
    z-index: 999;
    text-align: center;
    background-color: rgb(255, 255, 255);
    box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.28);
}
.sidehide{
    left: 75px;
}
.detail{
    padding: 30px;
}
.mt10{
    margin-bottom: 10px;
}
</style>


